<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="content-type" content="text/html; charset=UTF-8"/>



<title>PhoneGap 0.1</title>
<meta name="viewport" content="width=320; initial-scale=1.0; maximum-scale=1.0; user-scalable=0;"/>
<style type="text/css" media="screen">@import "file:///android_asset/iui.css";</style>
<script type="application/x-javascript" src="file:///android_asset/iui.js"></script>
<script type="application/x-javascript" src="file:///android_asset/gap.js"></script>


<script>

initGap = function() {
	 // Device.init() initializes OS-Device values
     Device.init();
     
     
     // Device.Location.init() to initalize location
     Device.Location.init();
     
     //Device.Acceleration.callback = updateAccel;
}

function addLoadEvent(func) {    
    var oldonload = window.onload;
    if (typeof window.onload != 'function') {
        window.onload = func;
    } else {
        window.onload = function() {
            oldonload();
            func();
        }
    }
}

updateSettings = function() {
  $('platform').value = Device.model;
  $('version').value = Device.version;
  $('osversion').value = Device.osversion;
  $('sdkversion').value = Device.sdkfwversion;
  $('gap_version').value = Device.gapVersion;
  $('uuid').value = Device.uuid;
}

updateLocation = function(lat, lon) {
	// updateLocatin based on user input
	// $('lat') is already the dom object
	// thus we need to
	// associate with a Device.Location.lat var
  $('lat').value = document.getElementById('lat').value;
  $('lon').value = document.getElementById('lon').value;
  Device.myLat = document.getElementById('lat').value;
  Device.myLon = document.getElementById('lon').value;
}

readLocation = function() {
     //assume that Device.Location.set ran once and thus
    // Device.Location.lat and Device>location.lon are set
  Device.Location.init();
  $('userlat').value = Device.Location.lat;
  $('userlon').value = Device.Location.lon;
  //we need to poll but have poll of functions run more than once during specified interval
  setInterval('readLocation()', Device.myGPSInterval);

}

userSetIntervals = function() {
	//allow user to set intervals for gps and accel polling
	//otherwise mad user to do to excessive polling of GPS values and etc
	//which reduces battery power
	$('usersgpsInterval').value = document.getElementById('usergpsInterval').value;
	Device.myGPSInterval = document.getElementById('usergpsInterval').value;
	$('useraccelInterval').value = document.getElementById('useraccelInterval').value;
	Device.myAccelInterval = document.getElementById('useraccelInterval').value;
}

updateAccel = function(){
	$('accelx').value = accelX;
	$('accely').value = accelY;
	$('accelz').value = accelZ;
	
	setTimeout(updateAccel,100);
}


receiveSmsNotification = function(func)
{
   if (func == 'watchPosition') {
       Device.notification.watchPosition('SMS');
   } else
   if (func == 'clearWatch') {
       Device.notification.clearWatch('SMS');
   }
} 

function onReceiveSms(number, message)
{
	$('number').value = number;
	$('message').value = message;
}

http = function(func)
{
	if (func == 'get') {
		Device.http.get($('httpGetUrl').value, $('httpGetFile').value);	
	}
}

fileManagement = function(x){
   if (x == 'getFreeDiskSpace'){
       $('file_status').value = Device.file.getFreeDiskSpace();
   }else
   if (x == 'testFileExists'){
       $('file_status').value = Device.file.testFileExists($('checkfile').value);
   }else
   if (x == 'testDirectoryExists'){
	   $('file_status').value = Device.file.testDirectoryExists($('checkdir').value);
   }else
   if (x == 'createDir'){
       $('file_status').value = Device.file.createDirectory($('createfile').value);
         }else
   if (x == 'delFile'){
       $('file_status').value = Device.file.deleteFile($('delfile').value);
   }else
   if (x == 'delDir'){
       $('file_status').value = Device.file.deleteDirectory($('deldir').value);
   }
} 

audio = function(func)
{
	if (func == 'startPlaying') {
		Device.audio.startPlaying($('audioFile').value);
	} else
	if (func == 'stopPlaying') {
		Device.audio.stopPlaying();
	} else
	if (func == 'startRecording') {
		Device.audio.startRecording($('audioFile').value);
	} else
	if (func == 'stopRecording') {
		Device.audio.stopRecording();
	} else
	if (func == 'getCurrentPosition') {
		$('posdur').value = Device.audio.getCurrentPosition();
	} else
	if (func == 'getDuration') {
		$('posdur').value = Device.audio.getDuration($('audioFile').value);
	}else
	if (func == 'setEarpiece') {
		Device.audio.setAudioOutputDevice(1);
	} else
	if (func == 'setSpeaker') {
		Device.audio.setAudioOutputDevice(2);
	}else
	if (func == 'getAudioOutputDevice') {
		$('audoutput').value = Device.audio.getAudioOutputDevice();
	}
	
}

phInformation = function(){
	alert ('Device.information.getLine1Number()');
   $('phnumber').value = Device.information.getLine1Number();
   $('vmnumber').value = Device.information.getVoiceMailNumber();
   $('nwoperator').value = Device.information.getNetworkOperatorName();
   $('simiso').value = Device.information.getSimCountryIso();
   $('tzid').value = Device.information.getTimeZoneID();
}


addLoadEvent(initGap);

</script>
</head>

<body  orient="landscape">
    <div class="toolbar">
        <h1 id="pageTitle">Main</h1>
        <a style="display: none;" id="backButton" class="button" href="#"></a>
    </div>
    
    <ul id="home" title="Main" selected="true">
        <li><a href="#system" onclick="updateSettings();return false;">System...</a></li>
        <li><a href="#geo" onclick="">Change Location...</a></li> 
        <li><a href="#readgeo" onclick="readLocation();">Read Location...</a></li>
        <li><a href="#setintervals" onclick="">Set user Intervals...</a></li>
        <!--   <li><a href="#geo" onclick="updateLocation();">Geo-Location...</a></li> -->
        <li><a href="#accel" onclick="updateAccel();">Accelerometer...</a></li>
        <li><a href="#vibration" onclick="Device.vibrate();">Vibration</a></li>
        <li><a href="#vibration" onclick="Device.playSound('on.mp3")">Play Sound</a></li>
        <li><a href="#photo" onclick="Device.Image.getFromPhotoLibrary();">Photo...</a></li>
        <li><a href="#audio" onclick="audio();">Audio...</a></li>
        <li><a href="#notification" onclick="notification();">Notification...</a></li>
        <li><a href="#http" onclick="http();">HTTP...</a></li>
        <li><a href="#file" onclick="">File IO...</a></li>
        <li><a href="#pi" onclick="phInformation();">Phone Info...</a></li> 
        <li><a href="http://phonegap.com/" target="_self">About</a></li>
    </ul>
    
    <div id="system" title="System" class="panel">
        <h2>PhoneGap</h2>
        <fieldset>
          
            <div class="row">
                <label>Version</label>
                <input disabled="enabled" id="gap_version" name="gap_version" value="" type="text"></input>
            </div>
        </fieldset>
        
        <h2>Device</h2>
        <fieldset>
            <div class="row">
                <label>Platform</label>
                <input disabled="enabled" id="platform" name="platform" value="" type="text"></input>
            </div>        
            <div class="row">
                <label>OS Version</label>
                <input disabled="enabled" id="osversion" name="osversion" value="" type="text"></input>
            </div>
            <div class="row">
                <label>SDK Version</label>
                <input disabled="enabled" id="sdkversion" name="sdkversion" vale="" type="text"></input>
                </div>
            <div class="row">
                <label>Version</label>
                <input disabled="enabled" id="version" name="version" value="" type="text"></input>
            </div>
            <div class="row">
                <label>UUID</label>
                <input style="font-size: 10px;" disabled="enabled" id="uuid" name="uuid" value="" type="text"></input>
            </div>
        </fieldset>
    </div>
    
     <div id="geo" title="Geo Location" class="panel"  >
        <h2>Change Location</h2>
        <fieldset>
            <div class="row">
                <label>Lat</label>
                <input  name="lat" id="lat" value="000.000" type="text"/>
            </div>        
            <div class="row">
                <label>Lon</label>
                <input  name="lon" id="lon" value="000.000" type="text"/>
            </div>
            <div class="row">
              <a class="button blueButton" type="submit" onclick="updateLocation();">Update Location</a>
            </div> 
        </fieldset>
    </div>
    
    <div id="readgeo" title="Read Location" class="panel"  >
        <h2>Read Location</h2>
        <fieldset>
            <div class="row">
                <label>Lat</label>
                <input disabled="enabled" name="lat" id="userlat" value="" type="text"/>
            </div>        
            <div class="row">
                <label>Lon</label>
                <input disabled="enable"  name="lon" id="userlon" value="" type="text"/>
            </div>
         </fieldset>
    </div>
    
    <div id="setintervals" title="Set Intervals" class="panel"  >
        <h2>Change Intervals</h2>
        <fieldset>
            <div class="row">
                <label>GPS </label>
                <input  name="lat" id="lat" value="60000" type="text"/>
            </div>        
            <div class="row">
                <label>Accel</label>
                <input  name="lon" id="lon" value="60000" type="text"/>
            </div>
            <div class="row">
              <a class="button blueButton" type="submit" onclick="userSetIntervals();">Set Intervals</a>
            </div> 
        </fieldset>
    </div>
    
    <div id="accel" title="Accelerometer" class="panel">
        <h2>Accelerometer</h2>
        <fieldset>
            <div class="row">
                <label>X</label>
                <input disabled="enabled" name="accelx" id="accelx" value="" type="text"></input>
            </div>        
            <div class="row">
                <label>Y</label>
                <input disabled="enabled" name="accely" id="accely" value="" type="text"></input>
            </div>
            <div class="row">
                <label>Z</label>
                <input disabled="enabled" name="accelz" id="accelz" value="" type="text"></input>
            </div>
        </fieldset>
    </div>
    
    <div id="notification" title="notification" class="panel">
    	<h2>Notification</h2>
    	<fieldset>
    		<div class="row">
    		<a class="button leftButton" type="submit" onclick="receiveSmsNotification('watchPosition');">startSmsListener</a>
    		<a class="button blueButton" type="submit" onclick="receiveSmsNotification('clearWatch');">stopSmsListener</a>
    		</div>
    	</fieldset>
    	<fieldset>
    		<div class="row">
    		<label>from:</label>
    		<input disabled="enabled" id="number" type="text"></input>
    		</div>
    	</fieldset>
    	<fieldset>
    		<div class="row">
    		<label>message:</label>
    		<input disabled="enabled" id="message" type="text"></input>
    		</div>
    	</fieldset>
    </div>
    
    <div id="http" title="http" class="panel">
    	<h2>HTTP</h2>
    	<p><i>Make sure your Android sdk sdcard is mounted!</i></p>
    	<fieldset>
    		<div class="row">
    		<a class="button leftButton" type="submit" onclick="http('get');">HTTP get remote_url</a>
    		</div>
    	</fieldset>
    	<fieldset>
    		<div class="row">
    		<label>remote_url:</label>
    		<input type=text name="httpGetUrl" id="httpGetUrl" size=60 maxlength=2048 value="http://hullomail.com/hulloworld.mp3" style="width: 30ex"></input>
    		</div>
    	</fieldset>
    	<fieldset>
    		<div class="row">
    		<label>destination:</label>
    		<input type=text name="httpGetFile" id="httpGetFile" size=60 maxlength=2048 value="/hullophonegap.mp3" style="width: 30ex"></input>
    		</div>
    	</fieldset>
    </div>
    
    <div id="file" title="file IO" class="panel"  >
             <h2>file IO</h2>
       <fieldset>
       <div class="row">
       		<label>File IO</label>
       		<input disabled="enabled" name="file_status" id="file_status" value="" type="text"></input>
    	</div>
   		<div class="row">
   			<a class="button leftButton" type="submit" onclick="fileManagement('getFreeDiskSpace');">getFreeDiskSpace</a>
      	</div>                     
      	<div class="row">
           	<a class="button leftButton" type="submit" onclick="fileManagement('testFileExists')">testFileExists</a>
           	<input type=text name="checkfile" id="checkfile" value="/hullophonegap.mp3" size=60 maxlength=2048 value="" style="width: 30ex"></input>
       	</div>
        <div class="row">
           	<a class="button leftButton" type="submit" onclick="fileManagement('testDirectoryExists')">testDirExists</a>
           	<input type=text name="checkdir" id="checkdir" value="/foo" size=60 maxlength=2048 value="" style="width: 30ex"></input>
       	</div>
        <div class="row">
      		<a class="button leftButton" type="submit" onclick="fileManagement('createDir');">Create Directory</a>
            <input type=text name="createfile" id="createfile" value="/foo" size=60 maxlength=2048 value="" style="width: 30ex"></input>
        </div>
        <div class="row">
           	<a class="button leftButton" type="submit" onclick="fileManagement('delFile');">Delete File</a>
            <input type=text name="delfile" id="delfile" value="/hullophonegap.mp3" size=60 maxlength=2048 value="" style="width: 30ex"></input>
        </div>
        <div class="row">
            <input type=text name="deldir" id="deldir" value="/foo" size=60 maxlength=2048 value="" style="width: 30ex"></input>
            <a class="button leftButton" type="submit" onclick="fileManagement('delDir');">Delete Directory</a>
        </div>
        </fieldset>
	</div> 
    
    <div id="audio" title="audio" class="panel">
    	<h2>Audio</h2>
    	<p><i>Make sure your Android sdk sdcard is mounted!</i></p>
    	<fieldset>
    		<div class="row">
    			<label>AudioFile:</label>
    			<input type=text name="audioFile" id="audioFile" size=60 maxlength=2048 value="/hullophonegap.mp3" style="width: 30ex"></input>
    		</div>
    		<div class="row">
    			<a class="button leftButton" type="submit" onclick="audio('startRecording');">startRecording</a>
    			<a class="button blueButton" type="submit" onclick="audio('stopRecording');">stopRecording</a>
    		</div>
    		<div class="row">
    			<a class="button leftButton" type="submit" onclick="audio('startPlaying');">startPlaying</a>
    			<a class="button blueButton" type="submit" onclick="audio('stopPlaying');">stopPlaying</a>
    		</div>
    		<div class="row">
    			<label>info:</label>
    			<input disabled="enabled" id="posdur" type="text" />
    		</div>
    		<div class="row">
    			<a class="button leftButton" type="submit" onclick="audio('getDuration');">getDuration</a>
    			<a class="button blueButton" type="submit" onclick="audio('getCurrentPosition');">getPosition</a>
    		</div>
    		<div class="row">
    			<a class="button leftButton" type="submit" onclick="audio('setEarpiece');">Earpiece</a>
    			<a class="button blueButton" type="submit" onclick="audio('setSpeaker');">Speaker</a>
    		</div>
    		<div class="row">
    			<a class="button leftButton" type="submit" onclick="audio('getAudioOutputDevice');">getAudioDevice</a>
    			<input disabled="enabled" id="audoutput" type="text" style="width: 30ex"/>
    		</div>
		</fieldset>
	</div>
		
		    
    <div id="pi" title="Phone Information" class="panel">
       <fieldset>
           <div class="row">
               <label>Phone NO.</label>
               <input disabled="enabled" name="phnumber" id="phnumber" value="" type="text" style="width: 30ex"></input>
           </div>                  
           <div class="row">
               <label>Voice Mail NO.</label>
               <input disabled="enabled" name="vmnumber" id="vmnumber" value="" type="text" style="width: 30ex"></input>
           </div>
           <div class="row">
               <label>Operator</label>
               <input disabled="enabled" name="nwoperator" id="nwoperator" value="" type="text" style="width: 30ex"></input>
           </div>
           <div class="row">
               <label>Sim Country ISO</label>
               <input disabled="enabled" name="simiso" id="simiso" value="" type="text" style="width: 30ex"></input>
           </div>
           <div class="row">
               <label>Time Zone</label>
               <input disabled="enabled" name="tzid" id="tzid" value="" type="text" style="width: 30ex"></input>
           </div> 
       </fieldset>
   </div>
    
<div id="preloader"></div>
		
</body>
</html>


